<!-- 搜索表单 -->
<template>
  <a-card :bordered="false" :body-style="{ paddingBottom: 0 }">
    <!-- 表格 -->
    <ele-pro-table ref="oceanBulkCargoFeeTableRef" row-key="id" :columns="columns" :datasource="datasource"
      :customRow="oceanBulkCargoFeeTableRowClick" :scroll="{ x: 1800 }" :needPage="false">
      <template #toolbar>
        <a-space>
          <a-button v-if="oceanBulkCargoFeeForm.bulkCargoId > 0 && receivePayBtnVisiBle" type="primary"
            @click="oceanBulkCargoFeeOpenEdit(null, 'receivable')" v-any-permission="['ocean:oceanBulkCargoFee:save']">
            <template #icon>
              <plus-outlined />
            </template>
            <span>应收</span>
          </a-button>
        </a-space>
        <a-space class="space">
          <a-button v-if="oceanBulkCargoFeeForm.bulkCargoId > 0 && receivePayBtnVisiBle" class="re"
            @click="oceanBulkCargoFeeOpenEdit(null, 'payable')" v-any-permission="['ocean:oceanBulkCargoFee:save']">
            <template #icon>
              <plus-outlined />
            </template>
            <span>应付</span>
          </a-button>
        </a-space>
        <a-space class="space">
          <a-popconfirm v-if="receiveVisiBle" title="应收费用确认吗？" @confirm="receiveComfirm()"
            v-any-permission="['ocean:oceanBulkCargoFee:receivableVerify']">
            <a-button type="primary">
              <template #icon>
                <plus-outlined />
              </template>
              <span>应收确认</span>
            </a-button>
          </a-popconfirm>
        </a-space>
        <a-space class="space">
          <a-popconfirm v-if="payVisiBle" title="应付费用确认吗？" @confirm="payComfirm()"
            v-any-permission="['ocean:oceanBulkCargoFee:payableVerify']">
            <a-button class="re">
              <template #icon>
                <plus-outlined />
              </template>
              <span>应付确认</span>
            </a-button>
          </a-popconfirm>
        </a-space>
        应收 {{ fee.receivable }} 应付 {{ fee.payable }} 利润 {{ fee.total }}
        &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
        &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
        应收抬头:
        <template v-for="(item, index) in fee.receivable_invoicename" :key="index">
          {{ item.invoicename }}: {{ item.price }}
          &nbsp;&nbsp;
        </template>
        &nbsp;&nbsp;
        &nbsp;&nbsp;
        应付抬头:
        <template v-for="(item, index) in fee.payable_invoicename" :key="index">
          {{ item.invoicename }}: {{ item.price }}
          &nbsp;&nbsp;
        </template>
      </template>
      <template #bodyCell="{ column, record }">
        <template v-if="column.key === 'invoicestate'">
          {{ record.invoicestate == 0 ? '不开票' : '开票' }}
        </template>
        <template v-if="column.key === 'type'">
          <a-tag v-if="record.type == '应收'" color="blue">
            {{ record.type }}
          </a-tag>
          <a-tag v-if="record.type == '应付'" color="red">
            {{ record.type }}
          </a-tag>
        </template>
        <template v-if="column.key === 'action' && oceanBulkCargo.state !== '结单'">
          <a-space>
            <a v-if="record.isEdit" @click="done(record, index)">完成</a>
            <a v-else @click="edit(record, index)">行修改</a>
            <a @click="oceanBulkCargoFeeOpenEdit(record)" v-any-permission="['ocean:oceanBulkCargoFee:update']">修改</a>
            <a-divider type="vertical" />
            <a-popconfirm title="确定要删除此项吗？" @confirm="oceanBulkCargoFeeRemove(record)">
              <a class="ele-text-danger" v-any-permission="['ocean:oceanBulkCargoFee:remove']">删除</a>
            </a-popconfirm>
          </a-space>
        </template>
      </template>
    </ele-pro-table>
  </a-card>
  <!-- 订单运费添加、修改弹窗 -->
  <ele-modal :width="460" v-model:visible="oceanBulkCargoFeeVisible" :confirm-loading="oceanBulkCargoFeeLoading"
    :title="oceanBulkCargoFeeIsUpdate ? '修改' + payable_receivable_type + '运费' : '新建' + payable_receivable_type + '运费'"
    :body-style="{ paddingBottom: '8px' }" @ok="oceanBulkCargoFeeSave" :maskClosable="false">
    <a-form ref="oceanBulkCargoFeeFormRef" :model="oceanBulkCargoFeeForm" :rules="oceanBulkCargoRules"
      :label-col="{ md: { span: 7 }, sm: { span: 24 } }" :wrapper-col="{ md: { span: 17 }, sm: { span: 24 } }">
      <a-form-item label="费用方向" name="type">
        <a-input allow-clear :maxlength="200" placeholder="请输入费用方向" v-model:value="oceanBulkCargoFeeForm.type"
          autocomplete="off" disabled="true" />
      </a-form-item>
      <a-form-item label="费用名称" name="feeName_val">
        <a-auto-complete v-model:value="oceanBulkCargoFeeForm.feeName_val" :options="feeNameOptions" placeholder="请输入"
          @select="feeName_onSelect" @search="feeName_onSearch" @blur="feeName_blur" allow-clear />
      </a-form-item>
      <a-form-item label="模块" name="feeModules">
        <a-input allow-clear :maxlength="200" placeholder="请输入模块" v-model:value="oceanBulkCargoFeeForm.feeModules"
          autocomplete="off" disabled="true" />
      </a-form-item>
      <a-form-item label="金额" name="price">
        <a-input allow-clear :maxlength="200" placeholder="请输入金额" v-model:value="oceanBulkCargoFeeForm.price"
          autocomplete="off" />
      </a-form-item>
      <a-form-item label="抬头" name="invoicename_val">
        <a-auto-complete v-model:value="oceanBulkCargoFeeForm.invoicename_val" :options="invoicenameOptions"
          placeholder="请输入" @select="invoicename_onSelect" @search="invoicename_onSearch" @blur="invoicename_blur"
          allow-clear />
      </a-form-item>
      <a-form-item label="开票" name="invoicestate">
        <a-select v-model:value="oceanBulkCargoFeeForm.invoicestate" placeholder="请选择" allow-clear>
          <a-select-option value="1">开票</a-select-option>
          <a-select-option value="0">不开票</a-select-option>
        </a-select>
      </a-form-item>
      <a-form-item label="币种" name="currency">
        <a-select v-model:value="oceanBulkCargoFeeForm.currency" placeholder="请选择" allow-clear>
          <a-select-option value="CNY">CNY</a-select-option>
          <a-select-option value="USD">USD</a-select-option>
        </a-select>
      </a-form-item>
      <a-form-item label="汇率" name="exchangeRate">
        <a-input allow-clear :maxlength="200" placeholder="请输入汇率" v-model:value="oceanBulkCargoFeeForm.exchangeRate"
          autocomplete="off" />
      </a-form-item>
      <a-form-item label="备注" name="remark">
        <a-input allow-clear :maxlength="200" placeholder="请输入备注" v-model:value="oceanBulkCargoFeeForm.remark"
          autocomplete="off" />
      </a-form-item>
    </a-form>
  </ele-modal>
</template>

<script setup>
import { ref, reactive, inject, watch } from 'vue';
import { toDateString, numberReg, negativeIntegerReg } from 'ele-admin-pro';
import useFormData from '@/utils/use-form-data';
import { message } from 'ant-design-vue';
import { TIME_OUT } from '@/config/damon';

import { pageOceanBulkCargoFee, removeOceanBulkCargoFee, addOceanBulkCargoFee, updateOceanBulkCargoFee } from '@/api/ocean/oceanBulkCargoFee';
import { payableVerify, receivableVerify } from '@/api/order/containerBill';
import { listMaintainFeeAttachsSel } from '@/api/order/maintainFeeAttach';
import { listInvoiceSel } from '@/api/order/customer';


// import keyWordsRef from '@/lin/utils/customref';

const emit = defineEmits(['containBillSelect']);
const props = defineProps({
  processListDataS: Array,
})

let receivePayBtnVisiBle = ref(false)
let payVisiBle = ref(false)
let receiveVisiBle = ref(false)
//权限判断 选择一条运单, 状态列表自动刷新同时自动调用流程显示按钮 权限的判断
receivePayBtnVisiBle.value = true
let permissions = (processListDataS) => {
  receivePayBtnVisiBle.value = true
  // receivePayBtnVisiBle_s(processListDataS)
  // receiveVisiBle_s(processListDataS)
  // payVisiBle_s(processListDataS)
}
//应收 应付 按钮显示
const receivePayBtnVisiBle_s = (processListDataS) => {
  receivePayBtnVisiBle.value = false
  if (!processListDataS || processListDataS.count == 0) { return false }
  let ret1 = false, ret2 = true
  if (processListDataS.list.findIndex(item => item.state == '接单') != -1) {
    ret1 = true
  }
  if (processListDataS.list[0].state == '结单') {
    ret2 = false
  }
  // console.log(processListDataS.list[0].state);
  if (ret1 && ret2) {
    receivePayBtnVisiBle.value = true
  }
}
//应收费用审核 按钮显示
const receiveVisiBle_s = (processListDataS) => {
  receiveVisiBle.value = false
  if (!processListDataS || processListDataS.count == 0) { return false }
  let cost = false, pay = true
  if (processListDataS.list.findIndex(item => item.state == '发起费用清单') != -1) {
    cost = true
  }
  if (processListDataS.list.findIndex(item => item.state == '应收费用审核') != -1) {
    pay = false
  }
  if (cost && pay) {
    receiveVisiBle.value = true
  }
}
//应付费用审核 按钮显示
const payVisiBle_s = (processListDataS) => {
  payVisiBle.value = false
  if (!processListDataS || processListDataS.count == 0) { return false }
  let cost = false, pay = true
  if (processListDataS.list.findIndex(item => item.state == '发起费用清单') != -1) {
    cost = true
  }
  if (processListDataS.list.findIndex(item => item.state == '应付费用审核') != -1) {
    pay = false
  }
  if (cost && pay) {
    payVisiBle.value = true
  }
}
// watch(() => props.processListDataS, (val) => {
//   // 只监听父元素传来的billId参数，billId变化才会触发
//   console.log(val);
// })


// 已添加成员
const bulkCargoFees = ref([]);

/* 编辑 */
const edit = (_row, index) => {
  console.log(_row, index);
  bulkCargoFees.value[index].isEdit = true;
};
/* 完成编辑 */
const done = (_row, index) => {
  bulkCargoFees.value[index].isEdit = false;
};

/* 删除 */
const remove = (_row, index) => {
  bulkCargoFees.value.splice(index, 1);
};

// 表格实例
const oceanBulkCargoFeeTableRef = ref(null);

// 表格列配置
const columns = ref([
  {
    key: 'index',
    width: 48,
    align: 'center',
    fixed: 'left',
    hideInSetting: true,
    customRender: ({ index }) => index + (oceanBulkCargoFeeTableRef.value?.tableIndex ?? 0)
  },
  {
    title: '类型',
    dataIndex: 'type',
    key: 'type',
    // sorter: true,
  },
  {
    title: '费用名称',
    dataIndex: 'feeName',
    key: 'feeName',
    // sorter: true,
  },
  {
    title: '模块',
    dataIndex: 'feeModules',
    key: 'feeModules',
    // sorter: true,
  },
  {
    title: '金额',
    dataIndex: 'price',
    key: 'price',
    // sorter: true,
  },
  {
    title: '抬头',
    dataIndex: 'invoicename',
    key: 'invoicename',
    // sorter: true,
  },
  {
    title: '开票',
    dataIndex: 'invoicestate',
    key: 'invoicestate',
    // sorter: true,
  },
  {
    title: '币种',
    dataIndex: 'currency',
    key: 'currency',
    // sorter: true,
  },
  {
    title: '汇率',
    dataIndex: 'exchangeRate',
    key: 'exchangeRate',
    // sorter: true,
  },
  {
    title: '备注',
    dataIndex: 'remark',
    key: 'remark',
    // sorter: true,
  },
  {
    title: '创建时间',
    dataIndex: 'createTime',
    key: 'createTime',
    // sorter: true,
    resizable: true,
    width: 150,
    ellipsis: true,
    customRender: ({ text }) => toDateString(text)
  },
  {
    title: '创建人',
    dataIndex: 'createName',
    key: 'createName',
    // sorter: true,
  },
  {
    title: '更新时间',
    dataIndex: 'updateTime',
    key: 'updateTime',
    // sorter: true,
    resizable: true,
    width: 150,
    ellipsis: true,
    customRender: ({ text }) => toDateString(text)
  },
  {
    title: '更新人',
    dataIndex: 'updateName',
    key: 'updateName',
    // sorter: true,
  },
  {
    title: '操作',
    key: 'action',
    width: 200,
    align: 'center',
    fixed: 'right',
    hideInSetting: true
  }
]);

// 表单数据
const { form: oceanBulkCargoFeeWhere, resetFields } = useFormData({
  username: '',
  sex: undefined,
  bulkCargoId: 0,
});

let fee = reactive({
  'payable': 0,
  'receivable': 0,
  'total': 0,
  'payable_invoicename': [],
  'receivable_invoicename': [],
})
// 表格数据源
const datasource = async ({ page, limit, where, orders }) => {
  if (oceanBulkCargoFeeForm.bulkCargoId == 0) {
    return new Promise((resolve) => {
      resolve({ count: 0, list: [] })
    })
  }
  limit = 1000
  fee.payable = 0
  fee.receivable = 0
  fee.total = 0
  fee.payable_invoicename = []
  fee.receivable_invoicename = []
  let data_temp = {}
  let invoiceRet_yf = true
  let invoiceRet_ys = true
  await pageOceanBulkCargoFee({ ...where, ...orders, page, limit }).then((msg) => {
    data_temp = msg
    msg.list.forEach(element => {
      let tPrice = parseFloat(element.price) * parseFloat(element.exchangeRate)
      invoiceRet_ys = true
      invoiceRet_yf = true
      if (element.type == '应收') {
        fee.receivable += tPrice
        fee.receivable_invoicename.forEach(ele2 => {
          if (ele2.invoicename == element.invoicename) {
            ele2.price += tPrice
            invoiceRet_ys = false
          }
        })
        if (invoiceRet_ys) {
          fee.receivable_invoicename.push({ invoicename: element.invoicename, price: tPrice })
        }
      } else if (element.type = '应付') {
        fee.payable += tPrice
        fee.payable_invoicename.forEach(ele2 => {
          if (ele2.invoicename == element.invoicename) {
            ele2.price += tPrice
            invoiceRet_yf = false
          }
        })
        if (invoiceRet_yf) {
          fee.payable_invoicename.push({ invoicename: element.invoicename, price: tPrice })
        }
      }
      fee.total = fee.receivable - fee.payable
    });
  }).catch((e) => {
  });
  bulkCargoFees.value.length = 0;
  data_temp.list.forEach((ele)=> {
    bulkCargoFees.value.push(ele)
  })

  console.log(bulkCargoFees.value);
  return new Promise((resolve) => {
    resolve(data_temp)
  })
}

/* 搜索 */
let oceanBulkCargo = ref(null)
const oceanBulkCargoFeeReload = (data) => {
  oceanBulkCargoFeeForm.bulkCargoId = data.bulkCargoId
  oceanBulkCargo.value = data
  oceanBulkCargoFeeWhere.bulkCargoId = data.bulkCargoId
  oceanBulkCargoFeeTableRef?.value?.reload({ page: 1, where: oceanBulkCargoFeeWhere });
};
defineExpose({ oceanBulkCargoFeeReload, permissions });

/*  重置 */
const oceanBulkCargoFeeReset = () => {
  resetFields();
  oceanBulkCargoFeeReload(oceanBulkCargo.value);
};

let oceanBulkCargoFeeTableRowClick = (record, index) => {
  return {
    onDblclick: (event) => {
      if (oceanBulkCargo.value.state !== '结单') {
        oceanBulkCargoFeeCurrent.value = record
        // oceanBulkCargoFeeOpenEdit(oceanBulkCargoFeeCurrent.value)
      }
    },
  }
}

/* 删除单个 */
const oceanBulkCargoFeeRemove = (record) => {
  const hide = message.loading('请求中..', 0);
  removeOceanBulkCargoFee(record.id).then((msg) => {
    hide();
    message.success(msg);
    oceanBulkCargoFeeReload(oceanBulkCargo.value);
  }).catch((e) => {
    hide();
    message.error(e.message);
  });
};

// const receivePayComfirm = (op) => {
//   if (props.processListDataS == null) { return false }
//   if (props.processListDataS.list.findIndex(item => item.state == '发起费用清单') != -1) {
//     if (props.processListDataS.list.findIndex(item => item.state == op) == -1) {
//       return true
//     }
//   }
//   return false
// }

// 当前选中数据
const oceanBulkCargoFeeCurrent = ref(null);

// 弹窗是否打开
const oceanBulkCargoFeeVisible = ref(false);

// 是否是修改
const oceanBulkCargoFeeIsUpdate = ref(false);

// 提交状态
const oceanBulkCargoFeeLoading = ref(false);

//
const oceanBulkCargoFeeFormRef = ref(null);

// 表单数据
const { form: oceanBulkCargoFeeForm, resetFields: oceanBulkCargoFeeResetFormFields } = useFormData({
  id: undefined,
  customer: '',
  vessel: '',
  currency: 'CNY',
  exchangeRate: 1,
  invoicestate: '0',
  bulkCargoId: '0',
});

// 表单验证规则
const oceanBulkCargoRules = reactive({
  feeName_val: [
    {
      required: true,
      type: 'string',
      validator: (_rule, value) => {
        return new Promise((resolve, reject) => {
          if (!value) {
            return reject('请输入费用名称');
          }
          if (value.indexOf("报关费") != -1) {
            return reject('请把报关费单独做到 "我的运单-报关"');
          }
          return resolve();
        });
      },
      trigger: 'blur'
    }
  ],
  price: [
    {
      required: true,
      pattern: '^[\-|0-9]{1,}$',
      message: '请输入金额',
    }
  ],
  invoicename_val: [
    {
      required: true,
      message: '请输入抬头',
      type: 'string',
      trigger: 'blur'
    }
  ],
});
//客户名称   防止重复刷新
let timeout = 0
const feeNameOptions = ref([]);
const feeName_onSearch = searchText => {
  clearTimeout(timeout)
  timeout = setTimeout(() => {
    listMaintainFeeAttachsSel({ 'name': searchText }).then(msg => {
      let option_temp = msg.map((element) => {
        element.label = element.label + ' -' + element.module
        element.value = element.value + '-' + element.price
      })
      feeNameOptions.value = msg
    }).catch((e) => {
    })
  }, TIME_OUT);
};
const feeName_onSelect = (value2, option2) => {
  // let a = feeNameOptions.value.find((item)=> {return item.value=value})
  // console.log(a.value,a.label)
  // form.name=a.value
  let label = option2.label.split(' -')[0]
  oceanBulkCargoFeeForm.feeName_val = label
  oceanBulkCargoFeeForm.feeName = label
  oceanBulkCargoFeeForm.feeModules = option2.module
  oceanBulkCargoFeeForm.price = option2.price
};
const feeName_change = (value2) => {
  let a = feeNameOptions.value.find((item) => { return item.value = value2 })
  oceanBulkCargoFeeForm.feeName_val = a.label
  oceanBulkCargoFeeForm.feeName = a.label
};
const feeName_blur = () => {
  oceanBulkCargoFeeForm.feeName_val = oceanBulkCargoFeeForm.feeName
};


//开票   防止重复刷新
const invoicenameOptions = ref([]);
const invoicename_onSearch = searchText => {
  clearTimeout(timeout)
  timeout = setTimeout(() => {
    listInvoiceSel({ 'name': searchText }).then(msg => {
      invoicenameOptions.value = msg
    }).catch((e) => {
    })
  }, TIME_OUT);
};
const invoicename_onSelect = (value2, option2) => {
  // let a = invoicenameOptions.value.find((item)=> {return item.value=value})
  // console.log(a.value,a.label)
  // { "code": 0, "data": [{ "value": "825", "label": "厦航厦航厦航厦航", "invoiceState": "0", "type": "" }], "message": "操作成功" }
  let label = option2.label.split(' -')[0]
  oceanBulkCargoFeeForm.invoicename_val = label
  oceanBulkCargoFeeForm.invoicename = label
  oceanBulkCargoFeeForm.invoicestate = option2.invoiceState
};
const invoicename_default_onSelect = async (b_type) => {
  await listInvoiceSel({ 'name': '' }).then(msg => {
    invoicenameOptions.value = msg
  }).catch((e) => {
  })
  let b_name = oceanBulkCargo.value.invoice.company
  if (b_type == '应收') {
  } else if (b_type == '应付') {
    if (oceanBulkCargo.value.invoice.carTeam == '甩手掌柜宁波车队') {
      b_name = oceanBulkCargo.value.invoice.driver
    } else {
      // b_name = oceanBulkCargo.value.invoice.company
    }
  }
  if (b_name == null || b_name == undefined || b_name == '') { return }
  let option2 = invoicenameOptions.value.find((item) => {
    return item.label == b_name || item.name == b_name
  })
  // console.log(invoicenameOptions, b_name, option2); 
  oceanBulkCargoFeeForm.invoicename_val = option2.label
  oceanBulkCargoFeeForm.invoicename = option2.label
  oceanBulkCargoFeeForm.invoicestate = option2.invoiceState
};

// const invoicename_change = (value2) => {
//   let a = invoicenameOptions.value.find((item) => { return item.value = value2 })
//   oceanBulkCargoFeeForm.invoicename_val = a.label
//   oceanBulkCargoFeeForm.invoicename = a.label
// };
const invoicename_blur = () => {
  // oceanBulkCargoFeeForm.invoicename = oceanBulkCargoFeeForm.invoicename_val
};

watch(() => oceanBulkCargoFeeForm.invoicename_val, (val) => {
  oceanBulkCargoFeeForm.invoicename = oceanBulkCargoFeeForm.invoicename_val
},
  { deep: true }
)
let payable_receivable_type = ref('')
/* 打开编辑弹窗 */
const oceanBulkCargoFeeOpenEdit = (record, type_t) => {
  if (oceanBulkCargoFeeForm.bulkCargoId == 0) {
    message.error('请选择一条运单');
    return
  }
  let bulkCargoId = oceanBulkCargoFeeForm.bulkCargoId
  oceanBulkCargoFeeResetFormFields();
  oceanBulkCargoFeeFormRef.value?.clearValidate();
  oceanBulkCargoFeeCurrent.value = record ?? {};
  oceanBulkCargoFeeVisible.value = true;
  Object.assign(oceanBulkCargoFeeForm, record ?? {});
  oceanBulkCargoFeeForm.bulkCargoId = bulkCargoId
  oceanBulkCargoFeeIsUpdate.value = !!record;
  oceanBulkCargoFeeForm.feeName_val = oceanBulkCargoFeeForm.feeName
  oceanBulkCargoFeeForm.invoicename_val = oceanBulkCargoFeeForm.invoicename
  if (type_t == 'receivable') {
    payable_receivable_type.value = '应收'
    oceanBulkCargoFeeForm.type = '应收'
  }
  if (type_t == 'payable') {
    payable_receivable_type.value = '应付'
    oceanBulkCargoFeeForm.type = '应付'
  }
  if (record == null) {
    invoicename_default_onSelect(payable_receivable_type.value)
  }
};

/* 保存编辑 */
const oceanBulkCargoFeeSave = () => {
  if (!oceanBulkCargoFeeFormRef.value) {
    return;
  }
  oceanBulkCargoFeeFormRef.value.validate().then(() => {
    oceanBulkCargoFeeLoading.value = true;
    const saveOrUpdate = oceanBulkCargoFeeIsUpdate.value ? updateOceanBulkCargoFee : addOceanBulkCargoFee;
    saveOrUpdate(oceanBulkCargoFeeForm).then((msg) => {
      oceanBulkCargoFeeLoading.value = false;
      message.success(msg);
      oceanBulkCargoFeeVisible.value = false;
      oceanBulkCargoFeeReload(oceanBulkCargo.value);
    }).catch((e) => {
      oceanBulkCargoFeeLoading.value = false;
      message.error(e.message);
    });
  }).catch(() => {
  });
};



//应收费用 确认按钮
const receiveComfirm = () => {
  receivableVerify({ 'id': oceanBulkCargoFeeForm.bulkCargoId, 'state': '应收费用审核' }).then((msg) => {
    message.success('应收费用已确认');
    emit('containBillSelect', msg);
  }).catch((e) => {
    message.error(e.message);
  });
}
//应付费用 确认按钮 
const payComfirm = () => {
  payableVerify({ 'id': oceanBulkCargoFeeForm.bulkCargoId, 'state': '应付费用审核' }).then((msg) => {
    message.success('应付费用已确认');
    emit('containBillSelect', msg);
  }).catch((e) => {
    message.error(e.message);
  });
}

</script>

<style lang="less" scoped>
@import "@/assets/css/public.less";

.re {
  background-color: @button-pay;
}

.space {
  margin-left: 10px;
  margin-right: 10px;
}
</style>
